<template>
	<view class="evaluation-item">
		<view class="evaluation-item-detail-wrapper">
			<view class="detail-icon-wrapper">
				<u-image width="100%" height="100%" border-radius="12" :src="orderView(evaluationData.task_code.substr(0,2)).icon"></u-image>
			</view>
			<view class="detail-info-wrapper">
				<view class="info-top-wrapper">
					<view class="top-title">
						{{orderView(evaluationData.task_code.substr(0,2)).title}}
					</view>
					<view class="top-date">
						{{evaluationData.created_at}}
					</view>
				</view>
				<view class="info-score-wrapper">
					<view class="score">
						<u-rate :value="evaluationData.score" :count="5" gutter="4" size="32" :min-count="1"
							active-color="#fcd165" disabled />
					</view>
					<view class="label">
						{{rateLabel[evaluationData.score]}}
					</view>
				</view>
			</view>
		</view>
		<!-- 		<view class="tag-list-wrapper">
			<view class="tag-item">
				专业性强
			</view>
		</view> -->
		<view class="evaluation-content-wrapper">
			{{evaluationData.remark?evaluationData.remark:'暂无评语'}}
		</view>
		<view class="reply-list-wrapper" v-if="replyList.length">
			<view class="reply-item" v-for="item,index in replyList" :key="item.id">
				<text class="sender-name">{{item.form_nickname}}回复{{item.to_nickname}}:</text>
				<text class="reply-content">{{item.remark}}</text>
			</view>
		</view>
		<view class="reply-btn-wrapper" @click="onClickReply" >
			<text class="reply-btn"><text class="iconfont icon-order-quickly icon"></text>{{userInfo.is_lawyer==1?'回复用户':'回复律师'}}</text>
		</view>
		<view class="order-number">
			工单编号:{{evaluationData.task_code}}
		</view>
	</view>
</template>

<script>
	import mixin from "../../mixin.js";
	export default {
		mixins:[mixin],
		props: {
			evaluationData: {
				type: Object,
			}
		},
		data() {
			return {
				rateLabel: ['未评分', '非常差', '较差', '普通', '满意', '非常满意'],
				score: 5,
				replyList: [],
			}
		},
		mounted() {
			this.$nextTick(() => {
				for (let item of this.evaluationData.evaluate_reply) {
					console.log('item>>>>>>>>>>>>>>>>>>>',item)
					this.replyList.push(item);
					this.getReplyList(item);
				}
				console.log('replyList>>>>>>>>>>>>>', this.replyList);
			})
		},
		computed:{
			isShowReplyBtn(){
				//是律师，评论列表为空可回复，是用户，评论列表为空不能回复
				//最后一条信息不能是自己
				console.log((this.userInfo.is_lawyer?true:!!this.replyList.length))
				return (this.userInfo.is_lawyer?true:!!this.replyList.length)&&(this.replyList.length?this.replyList[this.replyList.length-1].form_id!=this.userInfo.id:true);
			}
		},
		methods: {
			getReplyList(data) {
				if (!data.evaluate_reply.length) return
				for (let item of data.evaluate_reply) {
					this.replyList.push(item);
					this.getReplyList(item);
				}
			},
			onClickReply(){
				const id = this.replyList.length?this.replyList[this.replyList.length-1].id:this.evaluationData.id;
				console.log('id>>>>>>>>>>>>>>',id);
				this.$emit('onClickReply',id)
			}
		}
	}
</script>

<style scoped lang="scss">
	@import "./evaluationItem.scss";
</style>
